import {messages} from "share/common";
import React from 'react'
import { connect } from 'react-redux'
import { Tabs, Spin, Button } from 'antd'
const TabPane = Tabs.TabPane;
import FormDetailBase from 'containers/setting/form/form-detail/form-detail-base'
import FormDetailCustom from 'containers/setting/form/form-detail/form-detail-custom/form-detail-custom'
import FormPermission from 'containers/setting/form/form-detail/form-permission/form-permission'
import FormSetting from 'containers/setting/form/form-detail/form-setting/form-setting'
import 'styles/setting/form/form-detail.scss'
import formService from 'containers/setting/form/form.service'

class FormDetail extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      nowTab: 'base',
      formType: null,
      formOID: null,
      booksID: null, //账套id
      loading: false,
      form: null,
      propertyList: [],
      expenseTypeScope: {},
      loanTypeScope: {},
      userScope: {},
      visible: false
    }
  };

  componentWillMount(){
    const { formType, formOID, booksID } = this.props.params;
    if(formType){
      this.setState({
        formType,
        formOID: null,
        nowTab: 'base'
      });
    }
    if (booksID) {
      this.setState({booksID});
    }
    if(formOID) {
      this.setDetailByFormOID(formOID);
    }
  }

  setDetailByFormOID = (formOID) => {
    this.setState({loading: true}, () => {
      Promise.all([
        formService.getFormDetail(formOID),
        formService.getExpenseTypeScope(formOID, 99),
        formService.getUserScope(formOID),
        formService.getFormPropertyList(formOID),
        formService.getLoanTypeScope(formOID)
      ]).then(res => {
        this.setState({
          nowTab: 'custom',
          loading: false,
          formOID,
          form: res[0].data,
          formType: res[0].data.formType,
          expenseTypeScope: res[1].data,
          userScope: res[2].data,
          propertyList: res[3].data,
          loanTypeScope: res[4].data
        })
      })
    })
  };

  //刷新基本信息
  refreshBase = (formOID) => {
    if (formOID) {
      this.setState({loading: true}, () => {
        Promise.all([
          formService.getFormDetail(formOID),
          formService.getFormPropertyList(formOID)
        ]).then(res => {
          this.setState({
            loading: false,
            form: res[0].data,
            propertyList: res[1].data
          })
        })
      })
    }
  };

  //Tabs点击
  onChangeTabs = (key) => {
    this.setState({nowTab : key})
  };

  renderTabs() {
    let tabs = [
      {key: 'base', name: messages('setting.key591'/*基本信息*/)}
    ];
    this.props.params.formOID && tabs.push({key: 'custom', name: messages('setting.key623'/*详情设置*/)});
    this.props.params.formOID && tabs.push({key: 'permission', name: messages('setting.key624'/*权限分配*/)});
    this.state.formType === 2001 && tabs.push({key: 'form', name: messages('setting.key625'/*表单配置*/)});
    return (
      tabs.map(tab => {
        return <TabPane tab={tab.name} key={tab.key}/>
      })
    )
  }

  handleNew = (form) => {
    this.setDetailByFormOID(form.formOID)
  };

  //刷新分配公司，人员，费用,借款类型的数据
  refreshData = (type) => {
    const {formOID} = this.props.params;
    if (type === 'company' && formOID) {
      this.setState({loading: true}, () => {
        Promise.all([
          formService.getFormDetail(formOID)
        ]).then(res => {
          this.setState({
            loading: false,
            form: res[0].data
          })
        })
      })
    }
    if (type === 'user' && formOID) {
      this.setState({loading: true}, () => {
        Promise.all([
          formService.getUserScope(formOID)
        ]).then(res => {
          this.setState({
            loading: false,
            userScope: res[0].data
          })
        })
      })
    }
    if (type === 'expense' && formOID) {
      this.setState({loading: true}, () => {
        Promise.all([
          formService.getExpenseTypeScope(formOID, 99)
        ]).then(res => {
          this.setState({
            loading: false,
            expenseTypeScope: res[0].data
          })
        })
      })
    }
    if (type === 'loan' && formOID) {
      this.setState({loading: true}, () => {
        Promise.all([
          formService.getLoanTypeScope(formOID)
        ]).then(res => {
          this.setState({
            loading: false,
            loanTypeScope: res[0].data
          })
        })
      })
    }
  };

  getChildContext() {
    return {
      formType: Number(this.state.formType),
      formOID: this.state.formOID,
      booksID: this.state.booksID,
      form: this.state.form,
      propertyList: this.state.propertyList,
      expenseTypeScope: this.state.expenseTypeScope,
      loanTypeScope: this.state.loanTypeScope,
      userScope: this.state.userScope
    }
  }

  pageJump = (param) => {
    if (param) {
      this.setState({ nowTab: 'custom' })
    }
  };

  render() {
    const { nowTab, loading, visible } = this.state;
    const { formOID } = this.props.params;
    return (
      <div className="form-detail">
        <Spin spinning={loading}>
          <Tabs onChange={this.onChangeTabs} activeKey={nowTab}>
            {this.renderTabs()}
          </Tabs>
          {nowTab === 'base' && <FormDetailBase handleNew={this.handleNew} refreshBase={this.refreshBase}/>}
          {nowTab === 'custom' && <FormDetailCustom/>}
          {nowTab === 'permission' && <FormPermission refreshData={this.refreshData}/>}
          {nowTab === 'form' && <FormSetting formOID={formOID} handlePageJump={this.pageJump}/>}
        </Spin>
      </div>
    )
  }
}

FormDetail.childContextTypes = {
  formType: React.PropTypes.any,
  formOID: React.PropTypes.string,
  booksID: React.PropTypes.string,
  form: React.PropTypes.object,
  propertyList: React.PropTypes.array,
  expenseTypeScope: React.PropTypes.object,
  loanTypeScope: React.PropTypes.object,
  userScope: React.PropTypes.object,
  handlePageJump: React.PropTypes.func
};

function mapStateToProps(state) {
  return {
    tenantMode: state.main.tenantMode
  }
}

export default connect(mapStateToProps)(FormDetail)
